<template>
	<div class="my_friend">
		<!-- 我的朋友 -->
		<div class="my_friend_nav">
			<p><router-link to="/layout/found"><img src="../../../assets/icon-return45.png"></router-link>
			</p>
			<p><span>我的好友</span></p>
		</div>
		<div class="my_friend_list">
			<div class="my_friend_line">
				<div class="my_friend_linepc">
					<img src="../../../assets/280.png">
				</div>
				<div class="my_friend_lineft">
					<p>张三</p>
				</div>
			</div>
			<div class="my_friend_line">
				<div class="my_friend_linepc">
					<img src="../../../assets/180.png">
				</div>
				<div class="my_friend_lineft">
					<p>雪雪</p>
				</div>
			</div>
			<div class="my_friend_line">
				<div class="my_friend_linepc">
					<img src="../../../assets/380.png">
				</div>
				<div class="my_friend_lineft">
					<p>春天</p>
				</div>
			</div>
			<div class="my_friend_line">
				<div class="my_friend_linepc">
					<img src="../../../assets/580.png">
				</div>
				<div class="my_friend_lineft">
					<p>静静</p>
				</div>
			</div>
			<div class="my_friend_line">
				<div class="my_friend_linepc">
					<img src="../../../assets/980.png">
				</div>
				<div class="my_friend_lineft">
					<p>小高</p>
				</div>
			</div>
			<div class="my_friend_line">
				<div class="my_friend_linepc">
					<img src="../../../assets/780.png">
				</div>
				<div class="my_friend_lineft">
					<p>小小</p>
				</div>
			</div>
			<div class="my_friend_line">
				<div class="my_friend_linepc">
					<img src="../../../assets/680.png">
				</div>
				<div class="my_friend_lineft">
					<p>天美</p>
				</div>
			</div>
		</div>
		<!-- <musicPlayer></musicPlayer> -->
	</div>
</template>
<script>
import musicPlayer from '../../../components/music_player'
	export default {
		name:'myFriend',
		data(){
			return{
				
			}
		},
		components:{
			musicPlayer
		}
	}
</script>
<style scoped lang="Less">
  .my_friend{
  	width: 100%;
  	height: 1210 / 100rem;
	overflow: hidden;
	width: 100%;
	padding-bottom: 98/100rem;
	overflow: hidden;
  }
  .my_friend_nav img{
    width:30 /100rem;
    height: 50 / 100rem; 
}
.my_friend_nav{
    width: 100%;
	height: 88/100rem;
	overflow: hidden;
	background: url('../../../assets/daohang.png');
	background-size: 100%; 
	background-color: red;
}
.my_friend_nav p{
	float: left;
	margin-top: 16 / 100rem;
	margin-left: 20 / 100rem;
}
.my_friend_nav p span{
	display: inline-block;
    font-size: 40 / 100rem;
    margin-left: 250 / 100rem;
    margin-top:12 / 100rem;
    color: #fff;
}

.my_friend_list{
	width: 100%;
}
.my_friend_line{
	width: 100%;
	height: 100 / 100rem;
	border-bottom: 1/100rem solid #cccccc;
	overflow: hidden;
}
.my_friend_line div{
     float: left;
}
.my_friend_linepc{
	width: 80 / 100rem;
	height: 80 / 100rem;
}
.my_friend_linepc img{
	width: 80 / 100rem;
	height: 80 / 100rem;
	margin: 10/100rem 20/100rem;
}
.my_friend_lineft{
	height: 100 / 100rem;
	line-height: 100 / 100rem;
	margin-left:40 / 100rem; 
}
.my_friend_lineft p{
	font-size: 30 / 100rem;
	color: #333333;
}
	
</style>